$(function () {
    $("#jqGrid").Grid({
        url: '../sale/customer/list',
        colModel: [
			{label: 'id', name: 'id', index: 'id', key: true, hidden: true},
			{label: '客户名称', name: 'name', index: 'name', width: 80},
			{label: '手机号', name: 'phone', index: 'phone', width: 60},
			{label: '意向车型', name: 'productName', index: 'product_id', width: 90},
			{label: '客户类型', name: 'type', index: 'type', width: 40, formatter: function (value) {
					if(value === 1){
						return '<span class="label label-danger">个人</span>';
					}else if(value === 2){
						return '<span class="label label-success">大客户</span>';
					}else if(value === 3){
						return '<span class="label label-success">二网</span>';
					}else if(value === 4){
						return '<span class="label label-success">资源公司</span>';
					}else{
						return '<span class="label label-danger">客户</span>';
					}
				}
			},
			{label: '次数', name: 'num', index: 'num', width: 40},
			{label: '状态', name: 'state', index: 'state', width: 40, formatter: function (value) {
                return value === 1 ?
                        '<span class="label label-danger">已成交</span>' :
                        '<span class="label label-success">未成交</span>';
                }
			},
			{label: '备注', name: 'content', index: 'content', width: 100}]
    });
});

var vm = new Vue({
	el: '#rrapp',
	data: {
        showList: true,
        title: null,
		saleCustomer: {},
		ruleValidate: {
			name: [
				{required: true, message: '名称不能为空', trigger: 'blur'}
			],
			phone: [
		       {required: true, message: '手机号不能为空', trigger: 'blur'}
	        ]
		},
		q: {
			name: '',
			phone: '',
			productName: '',
			num: '',
			state: ''
		}
	},
	methods: {
		selectProductCar:function(){
			openWindow({
            	type: 2,
                title: "选择车型",
                area: ['80%', '60%'],
                content: ['../product/productcar.html'],
                btn: ['确定', '取消'],
                btn1: function (index,layero) {
                	var selectRowData = window[layero.find('iframe')[0]['name']].getSelectedRowData('#jqGrid');
                	vm.saleCustomer.productId=selectRowData.id;
                	vm.saleCustomer.productName=selectRowData.carSerie+" "+selectRowData.carModel+" "+selectRowData.design+" "+selectRowData.config+" "+selectRowData.colour;
                    layer.close(index);
                }
            });
		},
		query: function () {
			vm.reload();
		},
		add: function () {
			vm.showList = false;
			vm.title = "新增";
			vm.saleCustomer = {productId:null,productName:'',type:1};
		},
		update: function (event) {
            var id = getSelectedRow("#jqGrid");
			if (id == null) {
				return;
			}
			vm.showList = false;
            vm.title = "修改";

            vm.getInfo(id);
		},
		saveOrUpdate: function (event) {
            var url = vm.saleCustomer.id == null ? "../sale/customer/save" : "../sale/customer/update";
            Ajax.request({
			    url: url,
                params: JSON.stringify(vm.saleCustomer),
                type: "POST",
			    contentType: "application/json",
                successCallback: function (r) {
                    alert('操作成功', function (index) {
                        vm.reload();
                    });
                }
			});
		},
		del: function (event) {
            var ids = getSelectedRows("#jqGrid");
			if (ids == null){
				return;
			}

			confirm('确定要删除选中的记录？', function () {
                Ajax.request({
				    url: "../sale/customer/delete",
                    params: JSON.stringify(ids),
                    type: "POST",
				    contentType: "application/json",
                    successCallback: function () {
                        alert('操作成功', function (index) {
                            vm.reload();
                        });
					}
				});
			});
		},
		getInfo: function(id){
            Ajax.request({
                url: "../sale/customer/info/"+id,
                async: true,
                successCallback: function (r) {
                    vm.saleCustomer = r.saleCustomer;
                }
            });
		},
		reload: function (event) {
			vm.showList = true;
            var page = $("#jqGrid").jqGrid('getGridParam', 'page');
			$("#jqGrid").jqGrid('setGridParam', {
                postData: {
                	'name': vm.q.name,
					'phone': vm.q.phone,
					'productName': vm.q.productName,
					'num':vm.q.num,
					'state':vm.q.state
				},
                page: 1
            }).trigger("reloadGrid");
            vm.handleReset('formValidate');
		},
        reloadSearch: function() {
            vm.q = {
				name: '',
				phone: '',
				productName: '',
				num: '',
				state: ''
            };
            vm.reload();
        },
        handleSubmit: function (name) {
            handleSubmitValidate(this, name, function () {
                vm.saveOrUpdate()
            });
        },
        handleReset: function (name) {
            handleResetForm(this, name);
        }
	}
});